$(function () {
  let query = {
    pagenum: 1, //是	int	页码值
    pagesize: 2, //是	int	每页显示多少条数据
    cate_id: "", //否	string	文章分类的 Id
    state: "", //否	string	文章的状态，可选值有：已发布、草稿
  };

  let layer = layui.layer;
  // 需求展示文章列表
  initArticleList();
  function initArticleList() {
    axios({
      method: "GET",
      url: "/my/article/list",
      params: query,
    }).then((res) => {
      if (res.data.status !== 0) {
        return layer.msg(res.data.message);
      }
      // console.log(res.data);
      let arr = [];
      res.data.data.forEach((ele) => {
        arr.push(`
     <tr>
             <td>${ele.title}</td>
             <td>${ele.cate_name}</td>
             <td>${dateFormat(ele.pub_date)}</td>
             <td>${ele.state}</td>
             <td>
               <a href='/article/art_edit.html?id=${
                 ele.Id
               }' class="layui-btn layui-btn-xs">
                 编辑
               </a>
               <button
                 data-id='${ele.Id}'
                 class="btn-delete layui-btn layui-btn-xs layui-btn-danger"
               >
                 删除
               </button>
             </td>
           </tr>
             `);
      });
      let str = arr.join("");
      $("tbody").empty().html(str);
      pageRender(res.data.total);
    });
  }

  // 需求2 初始化文章分类(去发布文章中赋值)
  initArtCateList();
  function initArtCateList() {
    axios({
      method: "GET",
      url: "/my/article/cates",
    }).then((res) => {
      // console.log(res.data);
      if (res.data.status !== 0) {
        return layer.msg(res.message);
      }
      let arr = ['<option value="">请选择文章类别</option>]'];
      res.data.data.forEach((ele) => {
        arr.push(`
       <option value="${ele.Id}">${ele.name}</option>
              `);
        // 赋值
        let str = arr.join("");
        $("[name=cate_id]").empty().html(str);
        // 表单同步渲染
        layui.form.render();
      });
    });
  }

  // 需求3 筛选
  $("#formSearch").on("submit", function (e) {
    e.preventDefault();
    // 改变分类和状态两个全局参数
    query.cate_id = $("[name=cate_id]").val();
    query.state = $("[name=state]").val();
    // 重新调用文章列表初始方法
    initArticleList();
  });

  // 需求4 分页
  var laypage = layui.laypage;
  function pageRender(total) {
    // 执行一个laypage实例
    laypage.render({
      elem: "pageBox", //注意，这里的 test1 是 ID，不用加 # 号
      count: total, //数据总数，从服务端得到
      curr: query.pagenum, //当前页
      limit: query.pagesize, // 每页显示多少条
      // 实现定制化分页
      layout: ["count", "limit", "prev", "page", "next", "skip"],
      limits: [3, 5, 7, 9],
      jump: function (obj, first) {
        //obj包含了当前分页的所有参数，比如：
        // console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
        // console.log(obj.limit); //得到每页显示的条数

        //首次不执行
        if (!first) {
          //do something
          // 修改参数，重新渲染页面
          query.pagenum = obj.curr;
          query.pagesize = obj.limit;
          // 重新渲染
          initArticleList();
        }
      },
    });
  }

  // 需求5 删除文章
  $("tbody").on("click", ".btn-delete", function () {
    let id = $(this).attr("data-id");
    // alert(id);
    layer.confirm(
      "确认删除此文章吗?",
      { icon: 3, title: "提示" },
      function (index) {
        //do something
        axios({
          method: "GET",
          url: "/my/article/delete/" + id,
        }).then((res) => {
          if (res.data.status !== 0) {
            return layer.msg(res.data.message);
          }
          layer.msg("恭喜您，删除文章成功！");
          // 如果当前页面只剩一条数据，而且删除成功了，那么query.pagenum自减
          if ($(".btn-delete").length == 1 && query.pagenum >= 2) {
            query.pagenum--;
          }
          // 优化
          // $('.btn-delete').length == 1 && query.pagenum >= 2 && query.pagenum--

          initArticleList();
        });
        layer.close(index);
      }
    );
  });
});
